<template>
    <div class="header">
        <h1 class="header-text">城市选择</h1>
        <router-link to="/" class="router">
            <div class="header-left">
                <span class="iconfont back-icon">&#xe624;</span>
            </div>
        </router-link>
    </div>
</template>

<script>
export default {
  name: 'CityHeader'
}
</script>

<style scoped lang="stylus">
    @import '~styles/variables.styl'
    .header
      position: relative
      line-height: .86rem
      background-color: $bgcolor
      height: 0.86rem
      .header-text
        padding: 0 1rem 0 1rem
        text-align: center
        color: #ffffff
        font-size: .32rem
      .router
        .header-left
            width: 0.64rem
            height: 0.86rem
            line-height: 0.86rem
            text-align: center
            position: absolute
            left: 0
            top: 0
            .back-icon
               font-size 0.36rem
               color: #ffffff
</style>
